/** @type {import('tailwindcss').Config} */
export default {
  content: [
    "./index.html",
    "./src/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {
      spacing: {
        '4': '8rpx',
        '8': '16rpx',
        '12': '24rpx',
        '16': '32rpx',
        '20': '40rpx',
        '24': '48rpx',
        '32': '64rpx',
        '40': '80rpx',
        '48': '96rpx',
        '64': '128rpx',
        '80': '160rpx',
      },
      fontSize: {
        '28': '28rpx',
        '32': '32rpx',
        '36': '36rpx',
        '48': '48rpx',
      },
      borderRadius: {
        '20': '20rpx',
        '40': '40rpx',
      },
      height: {
        '24': '48rpx',
        '32': '64rpx',
        '64': '128rpx',
        '80': '160rpx',
      },
      width: {
        '24': '48rpx',
        '32': '64rpx',
        '64': '128rpx',
        '80': '160rpx',
      },
      borderWidth: {
        '4': '4rpx',
        '8': '8rpx',
      },
      backdropBlur: {
        'xl': '24rpx',
      },
      boxShadow: {
        'xl': '0 20rpx 25rpx -5rpx rgba(0, 0, 0, 0.1), 0 10rpx 10rpx -5rpx rgba(0, 0, 0, 0.04)',
        '2xl': '0 25rpx 50rpx -12rpx rgba(0, 0, 0, 0.25)',
      },
      zIndex: {
        '40': '40',
        '50': '50',
      },
    },
  },
  plugins: [],
} 